<template>
    <div id="websocket" >
    </div>
</template>

<script>
export default {
    name: 'Websocket',
    props: {
        space: String,
        me: String,
        path: {
            type: String,
            default: 'ws://' + window.location.hostname + ':14000/sang/'
        }
    },
    data () {
        return {
            socket: null, //socket
        }
    },
    mounted () {
        // 初始化
        this.init()
    },
    methods: {
        init: function () {
            if(typeof(WebSocket) === "undefined"){
                alert("您的浏览器不支持socket")
            }else{
                // 实例化socket
                this.socket = new WebSocket(this.path + this.space + '/' + this.me + '/')
                // 监听socket连接
                this.socket.onopen = this.open
                // 监听socket错误信息
                this.socket.onerror = this.error
                // 监听socket消息
                this.socket.onmessage = this.receive
            }
        },
        open: function () {
            console.log("socket连接成功")
        },
        error: function () {
            console.log("连接错误")
        },
        receive: function (msg) {
            console.log(msg)
            this.$parent.receive(msg.data)
        },
        send: function (msg) {
            this.socket.send(msg)
        },
        close: function () {
            console.log("socket已经关闭")
        }
    },
    unmounted () {
        // 销毁监听
        console.log('销毁监听')
        this.socket.onclose = this.close
    }
}
</script>

<style></style>